<template>
  <div>
     ==={{obj.name}}==={{name}}==={{age}}
     <input  type="button" @click="say()" value="btn"/>
  </div>
</template>

<script>
import {reactive,toRef} from  'vue'
/* 目的：setup中直接定义的数据  不是响应式数据   reactive函数  放的是复杂数据类型 */
export default {
  setup () {
    var obj2={
      name:'jack'
    }
    //  使用reactive函数将obj转变成响应式数据
    var obj=reactive({
      name:'jack',
      age:'18'
    })

    // var name=toRef(目标对象[要求是响应式对象],指定变成响应式对象的属性)
    var name=toRef(obj,'name')
    var age=toRef(obj,'age')
    const say = () => {
      // obj.name='rose'
       console.log(name.value)
       name.value='lucy'
       age.value=20
    }
    return {say,obj,name,age}
  }
}
</script>

<style lang="scss" scoped>

</style>